<template>
  <div>
    <van-row gutter="20" class="title_left">
      <van-col span="8" style="padding-top: 45px">
        <a @click="back" class="back_a" style="color: white; margin-left: 10px">
          返回
        </a>
      </van-col>
      <van-col
        span="8"
        style="text-align: center; color: white; padding-top: 45px"
        >新闻详情</van-col
      >
      <van-col span="8"></van-col>
    </van-row>
    <van-row class="topMargin">
      <van-col span="24">
        <div style="padding-left:10px;padding-right:10px">
        <h2>{{ title }}</h2>
        <div style="font-size:14px;color:#ccc">{{author}} 发布于: {{ publish_time}}</div>
        <div v-html="content"></div>
        </div>
      </van-col>
    </van-row>
    <van-row>
      <van-col span="24">
        <van-cell style="height:40px;background-color:white" class="bg_grey"></van-cell>
      </van-col>
    </van-row>
  </div>
</template>

<script>
import { Toast } from 'vant';
import { Api } from "../../../api/api_config";

export default {
  data() {
    return {
      article_id: "",
      content: "",
      title: "",
      publish_time: "",
      author: "",
    };
  },
  mounted() {
    this.initData();
  },
  methods: {
    initData() {
      this.article_id = this.$store.state.articleId;
      let that = this;
      Toast.loading({
        message: "加载中...",
        forbidClick: true,
      });
      this.$axios({
        method: Api.Article.get_article_id.method,
        url: Api.Article.get_article_id.url + this.article_id,
      })
        .then(function (response) {
          that.content = response.data.contents;
          that.title = response.data.title;
          that.publish_time = response.data.publish_time;
          that.author = response.data.author;
          Toast.clear()
        })
        .catch(function (error) {
          console.log(error)
          Toast.clear()
        });
    },
    back() {
      this.$router.push("/home");
    },
  },
};
</script>

<style scoped>
</style>
